<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>取消订单</title>
		<!--标准mui.css，公共样式-->
		<link rel="stylesheet" type="text/css" href="../css/mui.min.css" />
		<link rel="stylesheet" type="text/css" href="../css/iconfont/iconfont.css" />
		<link rel="stylesheet" type="text/css" href="../css/public.css" />
		<!--定义样式-->
		<link rel="stylesheet" type="text/css" href="../css/order.css" />
	</head>

	<body>
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left color6"></a>
			<h1 class="mui-title color3">取消订单</h1>
		</header>
		<div class="mui-content">
			<div class="Reason">
				<p>请你选择取消代驾的原因</p>
				<form class="mui-input-group p_t11">
					<!--<div class="mui-input-row mui-checkbox mui-left">
						<label>司机到位太慢，等不及</label>
						<input name="checkbox" class="item" value="司机到位太慢，等不及" type="checkbox" id="checkboxID">
					</div>
					<div class="mui-input-row mui-checkbox mui-left">
						<label>代驾收费太贵</label>
						<input name="checkbox" class="item" value="代驾收费太贵" type="checkbox">
					</div>
					<div class="mui-input-row mui-checkbox mui-left">
						<label>司机要求取消订单</label>
						<input name="checkbox" class="item" value="司机要求取消订单" type="checkbox">
					</div>
					<div class="mui-input-row mui-checkbox mui-left">
						<label>找到了其他代驾</label>
						<input name="checkbox" class="item" value="找到了其他代驾" type="checkbox">
					</div>
					<div class="mui-input-row mui-checkbox mui-left">
						<label>暂时不需要代驾了</label>
						<input name="checkbox" class="item" value="暂时不需要代驾了" type="checkbox">
					</div>-->
				</form>
				<textarea class="m_t10 font14" name="" rows="5" cols="" placeholder="其他原因，（ 最多200字。）"></textarea>
				<div class="p_tb11_lr15">
					<button type="button" class="mui-btn mui-btn-green bg_green btn-green w100 p_tb14 font18 bg_P b_r8" id="j_cancel">提交</button>
				</div>
			</div>
		</div>
	</body>
	<!-- Mui core JavaScript-->
	<script type="text/javascript" src="../js/mui.min.js"></script>
	<script type="text/javascript" src="../js/appconfig.js"></script>
	<script type="text/javascript" src="../js/jquery-2.2.4.min.js"></script>
	<script src="../js/app/order_cancel.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">
		window.onload = function() {
			$.ajax({
				type: "post",
				url: webRoot + "?s=/App/AppSystem/getSysReason",
				data: {
					usertype: 1
				},
				success: function(d) {
					var data = $.parseJSON(d);
					var datas=data.data;
					var html="";
					for(var i=0;i<data.data.length;i++){
						html+='<div class="mui-input-row mui-checkbox mui-left">'+
						'<label>'+datas[i].content+'</label>'+
						'<input name="checkbox" class="item" value="司机到位太慢，等不及" type="checkbox">'+
						'</div>';
					}
					$(".mui-input-group").html(html);
					console.log(JSON.stringify(data));

				},
				error: function(d) {
					alert(2222);

				}
			});
		}
	</script>
	<script type="text/javascript">
		var checkVal="";
		mui('.mui-input-group').on('change', 'input', function() {
				var rdsObj = document.getElementsByClassName("item");
				var checkVal = new Array();
				var k = 0;
				for(i = 0; i < rdsObj.length; i++) {
					if(rdsObj[i].checked) {
						checkVal[k] = rdsObj[i].value;
						k++;
					}
				}
			
				alert(checkVal.length);
				
		});
	</script>

</html>